<template>
  <div class="henader">
    <div class="top">返回</div>
    <div class="img">
      <img src="./image/QQ图片20190528130404.png" alt="#">
    </div>
    <div class="toggleBer">
      <span>
        <router-link to="login">登录</router-link>
      </span>
      <span>
        <router-link to="register">注册</router-link>
      </span>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: 'auth',
  data() {
    return {
    };
  },
};
</script>

<style scoped lang="scss">
  *{
    margin: 0;
    padding: 0;
  }
  .henader{
    width: 100vw;
    height: 100vh;
    .top{
      text-indent: 2rem;
      line-height: 50px;
    }
    .img{
      width: 60px;
      height: 60px;
      border-radius: 8px;
      border: 1px solid  #ddd;
      margin: 60px auto;
      position: relative;
      img{
        position: absolute;
        right: 0;
        top: 0;
        width: inherit;
        object-fit: cover;
      }
    }
    .toggleBer{
      width: 100vw;
      line-height: 30px;
      font-size: 0;
      span{
        font-size: 16px;
        display: inline-block;
        width: 50%;
        text-align: center;
      }
    }
  }

</style>
